<template>
    <section class="lunbo">
        <div class="swiper-container" id="bl">
            <div class="swiper-wrapper">
                <div class="swiper-slide" v-for="item in lblist">
                    <img :src="item.imageUrl" class="imgswiper" />
                </div>
            </div>
            <div class="swiper-pagination"></div>
        </div>
    </section>
</template>
<script>
    import $ from 'jquery';
    import Swiper from 'swiper';
    export default {
            data:function () {
                return {
                    lblist:[]
                }
            },
            mounted: function() {
                var url="http://localhost:3000/lunbo?time="+new Date().getTime();
                var that=this;
                $.get(url).then(function(res){
                    that.lblist=res.data.billboards;
                    console.log( that.lblist)
                    that.$nextTick(function() {
                        var mySwiper = new Swiper('#bl', {
                            loop:true,
                            // 如果需要分页器
                            pagination: '.swiper-pagination',
                                })
                    })
                    
                })
            }
    }
</script>
<style>
.swiper-slide{width: 100%;height: 100%;}
.imgswiper{width: 100%;height: 100%;}
.swiper-container{width: 100%;height:100%;}
</style>
